<%@ page import="java.util.List" %>
<%@ page import="java.util.ArrayList" %>
<%@ page import="java.util.Iterator" %>
<%@ page import="java.util.Map" %>
<%@ page import="java.util.LinkedHashMap" %>

		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
		<script type="text/javascript">
		$(function () {
		    var chart;
		    $(document).ready(function() {
		    	<% 
		    	List<String> cats4 = new ArrayList<String>();
			   	Map<String, Double> averageMap4 = new LinkedHashMap<String, Double>();
			   	List<Double> ownValues4 = new ArrayList<Double>();
			   	List<Double> averageValues4 = new ArrayList<Double>();
		     	Map<String, Double> ownMap4 = new LinkedHashMap<String, Double>();
		     	double container4 = 0;
		     	String title4 = "";
		     	String yAxis4 = "";
		     	try {
		     		cats4 = (ArrayList<String>) session.getAttribute("cats");
		     	averageMap4 = (Map<String, Double>) session.getAttribute("averageMap");
		     	ownMap4 = (Map<String, Double>) session.getAttribute("ownMap");
		     	container4 = (Double) session.getAttribute("container");
		     	title4 = (String) session.getAttribute("title");
		     	yAxis4 = (String) session.getAttribute("yAxis");
		     	}
		     	finally
		     	{
		     		
		     	}
		    	
		    	if(container4==0){ %>
		    	// Radialize the colors
				Highcharts.getOptions().colors = $.map(Highcharts.getOptions().colors, function(color) {
				    return {
				        radialGradient: { cx: 0.5, cy: 0.3, r: 0.7 },
				        stops: [
				            [0, color],
				            [1, Highcharts.Color(color).brighten(-0.3).get('rgb')] // darken
				        ]
				    };
				});
				<% } %>
		        chart = new Highcharts.Chart({
		    
		            chart: {
		                renderTo: 'container<%=container4%>',
		                type: 'column',
		                backgroundColor: '#FFFFFF'
		            },
		    
		            title: {
		                text: '<%=title4%>'
		            },
		    
		            xAxis: {
		                categories: [    <%  
		                                 int i =1;
                        for(String catName: cats4){
                       	 
                  		    	%>
                       '<%=catName%>'<% if(i!=cats4.size()){ %>,<%} i++; %>
                     
                       <% } %>],
                       
		           
		            labels: {
	                    rotation: -45,
	                    align: 'right',
	                    style: {
	                        fontSize: '13px',
	                        fontFamily: 'Verdana, sans-serif'
	                    }
	                }
	            },
		            yAxis: {
		                allowDecimals: false,
		                min: 0,
		                title: {
		                    text: '<%=yAxis4%>'
		                }
		            },
		    
		            tooltip: {
		                formatter: function() {
		                    return '<b>'+ this.x +'</b><br/>'+
		                        this.series.name +': '+ Math.round(this.y*100)/100 +'<br/>'+
		                        'Total: '+ Math.round(this.point.stackTotal*100)/100;
		                }
		            },
		    
		            plotOptions: {
		                column: {
		                    stacking: 'normal'
		                }
		            },
		    
		            series: [
		                     
<%

Iterator it4 = ownMap4.entrySet().iterator();

while (it4.hasNext()) {
	Map.Entry pairs = (Map.Entry)it4.next();
	String typeName = (String) pairs.getKey();
	Double values[]= (Double[]) pairs.getValue();
	
	%>{
		name: '<%=typeName%> (Your)',
		data: [
		       
		       <% int j=0;
		while(j!=values.length){
			double value= values[j];
			%>
			<%=value%><% if(values.length!=j-1){%>, <%}
			
			j++;
		}
		%>],
		stack: 'own'
	},<% }
				
	
%>
		                     
<%

Iterator it6 = averageMap4.entrySet().iterator();

while (it6.hasNext()) {
	Map.Entry pairs = (Map.Entry)it6.next();
	String typeName = (String) pairs.getKey();
	Double values[]= (Double[]) pairs.getValue();
	
	%>{
		name: '<%=typeName%> (Average)',
		data: [
		       
		       <% int j=0;
		while(j!=values.length){
			double value= values[j];
			%>
			<%=value%><% if(values.length!=j-1){%>, <%}
			
			j++;
		}
		%>],
		stack: 'average'
	} <% if(it6.hasNext()){%>, <%}
	}
	%>		]
		        });
		    });
		    
		});
		</script>
<script src="../Scripts/highcharts/js/highcharts.js"></script>
<script src="../Scripts/highcharts/js/modules/exporting.js"></script>

<div id="container<%=container4%>" style="min-width: 400px; height: 400px; margin: 0 auto"></div>

